A basic example of a Bar chart that uses the pseudo events

This is a basic example of the Bar chart that shows you how to use the pseudo-events that RGraph has:

events.click
events.mousemove

Here the mousemove event is used to change the mouse cursor (it's automatically changed back for you). And the click event is used to show an alert.

This goes in the documents header:

<script src="RGraph.common.core.js"></script>
<script src="RGraph.common.dynamic.js"></script>
<script src="RGraph.bar.js"></script>

Put this where you want the chart to show up:

<canvas id="cvs" width="1000" height="250">
    [No canvas support]
</canvas>

This is the code that generates the chart:

<script>
    window.onload = function ()
    {
        /**
        * This is the function for the mousemove event. It changes the pointer to the hand.
        * When the mouse is moved away from the bar the pointer is changed back to what it was
        * automatically for you.
        * 
        * @param object e The event object
        * @param array  bar The details of the bar thats was mouseover'ed
        */
        function myMousemove (e, bar)
        {
            return true;
        }


        /**
        * This is the function for the click event.
        * 
        * @param object e The event object
        * @param array  bar The details of the bar thats was clicked
        */
        function myClick (e, bar)
        {
            alert('A bar was clicked');
        }


        var bar = new RGraph.Bar({
            id: 'cvs',
            data: [12,13,16,15,16,19,19,12,23,16,13,24],
            options: {
                textAccessible: true,
                eventsMousemove: myMousemove,
                eventsClick: myClick,
                labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            }
        }).draw();
    };
</script>